import { IDomEditor, SlateDescendant, SlateElement } from "@wangeditor-next/editor";

/**
 * 解析返回的 HTML 字符串，生成 新元素
 * @param domElem HTML 对应的 DOM Element
 * @param children 子节点
 * @param editor editor 实例
 * @returns 新元素，如上文的 disabledText
 */
function disabledHtml(
  domElem: Element,
  children: SlateDescendant[],
  editor: IDomEditor
): SlateElement {
  const value = domElem.innerHTML || "";

  // 生成“附件”元素（按照此前约定的数据结构）
  const myResume = {
    type: "disabledText",
    value,
    children: [{ text: value || "" }], // void node 必须有 children ，其中有一个空字符串，重要！！！
  };

  return myResume;
}

/**
 * 解析自定义字段
 * 分割出<span class="disabled-text"></span>中的内容
 */
export function parseCustomField(html: string) {
  const regex = /<span data-w-e-type="disabledText">(.*?)<\/span>/g;
  let matches;
  let results = [];

  while ((matches = regex.exec(html)) !== null) {
    // 匹配内容在matches[1]中
    const content = matches[1].trim();
    results.push(content);
  }
  return results;
}

const parseHtmlConf = {
  selector: 'span[data-w-e-type="disabledText"]', // CSS 选择器，匹配特定的 HTML 标签
  parseElemHtml: disabledHtml,
};

export default parseHtmlConf;
